<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8">
    <title>Roker  - Corporate, Creative, Multi Purpose, Responsive And Retina Template</title> 
    <meta name="keywords" content="HTML5 Template" />
    <meta name="description" content="Roker  - Corporate, Creative, Multi Purpose, Responsive And Retina Template">
    <meta name="author" content="iwthemes.com">   

    <!-- Mobile Metas -->
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <!-- Theme CSS -->
    <link href="css/style.css" rel="stylesheet" media="screen">

    <!-- Skins Theme -->
    <link href="#" rel="stylesheet" media="screen" class="skin">

    <!-- Favicons -->
    <link rel="shortcut icon" href="img/icons/favicon.ico">
    <link rel="apple-touch-icon" href="img/icons/apple-touch-icon.png">
    <link rel="apple-touch-icon" sizes="72x72" href="img/icons/apple-touch-icon-72x72.png">
    <link rel="apple-touch-icon" sizes="114x114" href="img/icons/apple-touch-icon-114x114.png">  

    <!-- Head Libs -->
    <script src="js/modernizr.js"></script>

    <!--[if lte IE 9]>
        <script src="http://getbootstrap.com/docs-assets/js/html5shiv.js"></script>
        <script src="js/responsive/respond.js"></script>
    <![endif]-->

    <!-- styles for IE -->
    <!--[if lte IE 8]>
        <link rel="stylesheet" href="css/ie/ie.css" type="text/css" media="screen" />            
    <![endif]-->

    <!-- Skins Changer-->
    <script type="text/javascript" src="http://www.google.com/jsapi"></script>
   
  </head>
  <body> 

    <!-- Theme-options -->
    <div id="theme-options">
            <div class="title">Theme Options<span title="Theme Options"><i class="fa fa-cogs right"></i></span></div>
            <span>COLORS</span>
            <ul id="colorchanger">      
                <li><a class="colorbox blue" href="?theme=blue" title="Blue Skin"></a></li>
                <li><a class="colorbox red" href="?theme=red" title="Red Skin"></a></li>
                <li><a class="colorbox yellow" href="?theme=yellow" title="Yellow Skin"></a></li>
                <li><a class="colorbox green" href="?theme=green" title="Green Skin"></a></li>
                <li><a class="colorbox orange" href="?theme=orange" title="Orange Skin"></a></li>
                <li><a class="colorbox purple" href="?theme=purple" title="Purple Skin"></a></li>
                <li><a class="colorbox pink" href="?theme=pink" title="Pink Skin"></a></li>
                <li><a class="colorbox cocoa" href="?theme=cocoa" title="Cocoa Skin"></a></li>
            </ul>
            <span>LAYOUT STYLE</span>
            <ul class="layout-style">      
                <li class="wide active">Wide</li>
                <li class="boxed">Boxed</li> 
                <li class="boxed-margin">Boxed Margin</li>               
            </ul>
            <span>WEBSITE TYPE</span>
           <ul class="layout-style">      
                <li class="active"><a href="index.html">Corporate</a></li>
                <li><a href="index-creative.html">Creative</a></li>
                <li><a href="index-one-page.html" >One Page</a></li>                
            </ul>  
            <div class="patterns">
                <span>BACKGROUND PATTERNS</span>
                <ul class="backgrounds">
                    <li class="bgnone" title="None - Default"></li>
                    <li class="bg1"></li>
                    <li class="bg2"></li>
                    <li class="bg3"></li>
                    <li class="bg4 "></li>
                    <li class="bg5"></li> 
                    <li class="bg6"></li>
                    <li class="bg7"></li>
                    <li class="bg8"></li>
                    <li class="bg9 "></li>
                    <li class="bg10"></li> 
                    <li class="bg11"></li>                   
                </ul>  
            </div>
    </div>
    <!-- End Theme-options -->
         
    <!-- layout-->
    <div id="layout">

         <!-- Login Client -->
        <div class="jBar">
          <div class="container">            
              <div class="row">    

                  <div class="col-md-10">
                     <div class="row padding-top-mini">
                        <!-- Item service-->
                        <div class="col-md-4">
                            <div class="item-service border-right">
                                <div class="row head-service">
                                    <div class="col-md-2">
                                        <i class="fa fa-check-square"></i>                             
                                    </div>
                                    <div class="col-md-10">
                                        <h5>Login or create new account.</h5>
                                    </div>
                                </div>  
                                <p>Pellentesque habitant morbi fames ac turpis egestas. Vestibulum tortor quam. Pellentesque habitant</p>
                            </div>
                        </div>      
                        <!-- End Item service-->

                        <!-- Item service-->
                        <div class="col-md-4">
                            <div class="item-service border-right">
                                <div class="row head-service">
                                    <div class="col-md-2">
                                        <i class="fa fa-star"></i>                             
                                    </div>
                                    <div class="col-md-10">
                                        <h5>Review your order.</h5>
                                    </div>
                                </div>  
                                <p>Pellentesque habitant morbi fames ac turpis egestas. Vestibulum tortor quam Pellentesque habitant.</p>
                            </div>
                        </div>      
                        <!-- End Item service-->

                        <!-- Item service-->
                        <div class="col-md-4">
                            <div class="item-service border-right">
                                <div class="row head-service">
                                    <div class="col-md-2">
                                        <i class="fa fa-credit-card"></i>                             
                                    </div>
                                    <div class="col-md-10">
                                        <h5>Payment And FREE shipment.</h5>
                                    </div>
                                </div>  
                                <p>Pellentesque habitant morbi fames ac turpis egestas. Vestibulum tortor quam. Pellentesque habitant</p>
                            </div>
                        </div>      
                        <!-- End Item service-->
                     </div>
                  </div>

                  <div class="col-md-2">
                      <h5>Client Login</h5>
                      <form>
                          <input type="email" placeholder="Username" required>
                          <input type="password" placeholder="Password" required>
                          <input type="submit" class="btn btn-primary" value="sign in">
                          <span>Or</span>                       
                          <input type="submit" class="btn btn-primary" value="Register">
                      </form>
                  </div>

                            
                  <span class="jTrigger downarrow"><i class="fa fa-minus"></i></span>
              </div>
          </div>
      </div>
      <span class="jRibbon jTrigger up" title="Login"><i class="fa fa-plus"></i></span>
      <div class="line"></div>
      <!-- End Login Client -->

        <!-- Info Head -->
        <section class="info-head">  
            <div class="container">
                <ul>  
                    <li><i class="fa fa-headphones"></i> 01800034567</li>
                    <li><i class="fa fa-comment"></i> <a href="#">Live chat</a></li>
                    <li>
                        <ul>
                          <li class="dropdown">
                            <i class="fa fa-globe"></i> 
                            <a class="dropdown-toggle" data-toggle="dropdown" href="#">
                                Language<i class="fa fa-angle-down"></i>
                            </a>
                             <ul class="dropdown-menu">  
                                 <li><a href="#"><img src="img/language/spanish.png" alt="">Spanish</a></li>
                                 <li><a href="#"><img src="img/language/english.png" alt="">English</a></li>
                                 <li><a href="#"><img src="img/language/frances.png" alt="">Frances</a></li>
                                 <li><a href="#"><img src="img/language/portugues.png" alt="">Portuguese</a></li>
                            </ul>
                          </li>                      
                        </ul>
                    </li>
                </ul> 
            </div>            
        </section>
        <!-- Info Head -->

        <!-- Header-->
        <header class="animated fadeInDown delay1">           
            <div class="container">
                <div class="row">

                    <!-- Logo-->
                    <div class="col-md-3 logo">
                        <a href="index.html" title="Return Home">                            
                            <img src="img/logo.png" alt="Logo" class="logo_img">
                        </a>
                    </div>
                    <!-- End Logo-->
                                                      
                    <!-- Nav-->
                    <nav class="col-md-9">
                        <!-- Menu-->
                        <ul id="menu" class="sf-menu">
                            <li>
                                <a href="index.html">HOME <i class="fa fa-angle-down"></i></a>
                                <ul>                                  
                                    <li><a href="index.html">Home Corporate</a></li>
                                    <li><a href="index-creative.html">Home Creative</a></li>
                                    <li><a href="index-alternative.html">Home Alternative</a></li>
                                    <li><a href="index-one-page.html">Home One Page</a></li>
                                </ul>
                            </li>
                            <li><a href="about.html">ABOUT</a></li>
                            <li><a href="services.html">SERVICES <i class="fa fa-angle-down"></i></a>
                                <ul>                                  
                                    <li><a href="services.html">Services Default</a></li>
                                    <li><a href="services-options.html">6 services options</a></li><li><a href="http://www.weidea.net">More</a></li>
                                </ul>
                            </li>
                            <li>
                                <a href="feature-princing-tables.html">FEATURES <i class="fa fa-angle-down"></i></a>
                                <ul>  
                                    <li>
                                        <a href="#">Sliders Options<i class="fa fa-angle-right"></i></a>
                                        <ul>
                                            <li><a href="index.html">Camera Slider Advance Captions</a></li>
                                             <li><a href="index-one-page.html">Camera Slider Simple Captions</a></li>
                                            <li><a href="index-alternative.html">Flex Slider ( Video option)</a></li>
                                        </ul>
                                    </li>  
                                    <li>
                                        <a href="#">Pages <i class="fa fa-angle-right"></i></a>
                                        <ul>
                                            <li><a href="page-register.html">Register User</a></li>                              
                                            <li><a href="page-full-width.html">Full Width</a></li>
                                            <li><a href="page-left-sidebar.html">Left Sidebar</a></li>
                                            <li><a href="page-right-sidebar.html">Right Sidebar</a></li>
                                            <li><a href="page-404.html">404 Page</a></li>
                                            <li><a href="page-faq.html">FAQ</a></li>
                                            <li><a href="sitemap.html">Sitemap</a></li>
                                         </ul>
                                    </li> 
                                    <li>
                                        <a href="#">Headers <i class="fa fa-angle-right"></i></a>
                                        <ul>
                                            <li><a href="feature-header-1.html">Header Version 1</a></li>
                                            <li><a href="feature-header-2.html">Header Version 2</a></li>
                                            <li><a href="feature-header-3.html">Header Version 3</a></li>
                                        </ul>
                                    </li> 
                                    <li>
                                        <a href="#">Footers <i class="fa fa-angle-right"></i></a>
                                        <ul>
                                            <li><a href="feature-footer-1.html#footer">Footer Version 1</a></li>
                                            <li><a href="feature-footer-2.html#footer">Footer Version 2</a></li>
                                            <li><a href="feature-footer-3.html#footer">Footer Version 3</a></li>
                                        </ul>
                                    </li>                           
                                    <li><a href="feature-princing-tables.html">Princing Tables</a></li>
                                    <li><a href="feature-grid-system.html">Grind System</a></li>
                                    <li><a href="feature-typograpy.html">Tipograpy</a></li>
                                    <li><a href="feature-icons.html">Icons</a></li>
                                    <li><a href="feature-elements.html">Elements</a></li>
                                 </ul>
                            </li>   
                            <li>
                                <a href="work-4-columns.html">WORK <i class="fa fa-angle-down"></i></a>
                                <ul>                                  
                                    <li><a href="work-4-columns.html">4 Columns</a></li>
                                    <li><a href="work-3-columns.html">3 Columns</a></li>
                                    <li><a href="work-2-columns.html">2 Columns</a></li>
                                    <li><a href="single-work.html">Single Work</a></li>
                                </ul>
                            </li>                                
                                <li>
                                <a href="blog.html">BLOG <i class="fa fa-angle-down"></i></a>
                                <ul>                                  
                                    <li><a href="blog.html">Post</a></li>
                                    <li><a href="blog-post.html">Single Post</a></li>
                                </ul>
                            </li>                                                                        
                            <li><a href="contact.html">CONTACT</a></li>
                        </ul>
                        <!-- End Menu-->
                    </nav>
                    <!-- End Nav-->
                    
                </div><!-- End Row-->
            </div><!-- End Container-->
        </header>
        <!-- End Header-->


        <!-- Title Section -->           
        <section class="title-section">
            <div class="container">
                <!-- crumbs --> 
                <div class="row crumbs">
                   <div class="col-md-12">
                        <a href="index.html">Home</a> / About
                   </div>
                </div>
                <!-- End crumbs --> 

                <!-- Title - Search--> 
                <div class="row title">
                    <!-- Title --> 
                    <div class="col-md-9">
                        <h1>About Us
                            <span class="subtitle-section">
                                Great Company
                                <span class="left"></span>
                                <span class="right"></span>
                            </span>
                            <span class="line-title"></span>
                        </h1>
                    </div>
                    <!-- End Title--> 

                    <!-- Search--> 
                    <div class="col-md-3">
                        <form class="search" action="#" method="Post">
                            <div class="input-group">
                                <input class="form-control" placeholder="Search..." name="email"  type="email" required="required">
                                <span class="input-group-btn">
                                    <button class="btn btn-primary" type="submit" name="subscribe" >Go!</button>
                                </span>
                            </div>
                        </form>  
                    </div>
                    <!-- End Search--> 
                </div>
                <!-- End Title -Search --> 
                
                <!-- info-title-section - optional --> 
                <div class="row info-title-section">
                    <div class="col-md-2 incon-title">
                       <i class="fa fa-android"></i>
                    </div>
                    <div class="col-md-10">
                       <p>Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Vestibulum tortor quam, feugiat vitae, ultricies eget, tempor sit amet, ante. Donec eu libero sit amet quam egestas semper. Aenean ultricies mi vitae est. Mauris placerat eleifend leo.</p>
                    </div>
                </div>
                <!-- End info-title-section - optional --> 

            </div>
        </section>   
        <!-- End Title Section --> 


        <!-- Info About Us -->
        <section class="paddings">
            <div class="container">
                <div class="row">

                    <div class="col-md-7">
                         <h3>WHO WE ARE</h3>
                         <p>Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Vestibulum tortor quam, feugiat vitae, ultricies eget, tempor sit amet, ante. Donec eu libero sit amet quam egestas semper. Aenean ultricies mi vitae est. Mauris placerat eleifend leo. Quisque sit amet est et sapien ullamcorper pharetra.</p>
                         <p> Vestibulum erat wisi, condimentum sed,  feugiat vitae, ultricies eget commodo vitae, ornare sit amet, wisi. Aenean fermentum, elit eget tincidunt condimentum, Praesent dapibus, neque id cursus faucibus, tortor neque egestas augue, eu vulputate magna eros eu erat. Aliquam erat volutpat. Nam dui mi, tincidunt quis, accumsan porttitor, facilisis luctus.</p>
                    </div>

                    <div class="col-md-5">
                        <!-- Simple-slide --> 
                        <div id="carousel-example-generic" class="carousel slide bs-docs-carousel-example">
                            <ol class="carousel-indicators">
                                <li data-target="#carousel-example-generic" data-slide-to="0" class="active"></li>
                                <li data-target="#carousel-example-generic" data-slide-to="1" class=""></li>
                                <li data-target="#carousel-example-generic" data-slide-to="2" class=""></li>
                            </ol>
                            <div class="carousel-inner">
                                <div class="item active">
                                    <img src="img/works/1.jpg" alt="">
                                </div>
                                <div class="item">
                                    <img src="img/works/2.jpg" alt="">
                                </div>
                                <div class="item">
                                    <img src="img/works/3.jpg" alt="">
                                </div>
                            </div>
                            <a class="left carousel-control" href="#carousel-example-generic" data-slide="prev">
                                <span class="icon-prev"></span>
                            </a>
                            <a class="right carousel-control" href="#carousel-example-generic" data-slide="next">
                                <span class="icon-next"></span>
                            </a>
                        </div>
                        <!-- End Simple-slide --> 
                    </div>

                </div>             
            </div>
            <!-- End Container-->
        </section>
        <!-- End Info About Us-->


        <!-- Slides Team -->
        <section class="section-gray borders padding-top slide-team">
           
            <!-- Slide Team  -->
            <ul id="slide-team">
                    
                    <!-- Item Slide Team  -->
                    <li>
                        <div class="container">
                            <div class="row">

                                <!-- Image Team  -->
                                <div class="col-md-3">
                                   <a href="img/team-members/1.png" class="fancybox">
                                        <img src="img/team-members/1.png" alt="" title="View Image">
                                    </a>
                                </div>
                                <!-- End Image Team  -->
                                
                                <!-- Info  Team  -->
                                <div class="col-md-5 padding-top-mini">
                                  <h3 class="title-subtitle">
                                        Federic Gordon.
                                        <span>Front End.</span>
                                   </h3>
                                   <p>Inani nominati sit eu. Te ubique cotidieque philosophia mel, vix id omnes iudico prompta. Ex usu nihil mediocritatem. Sea quod vituperata no, omittam offendit vel in. Noster voluptua luptatum id mea.</p>

                                    <a href="mailto:demo@ithemes.com" target="_blank" class="btn btn-primary">SEND ME AN EMAIL</a>

                                    <!-- Social-->
                                    <ul class="social">
                                        <li data-toggle="tooltip" title data-original-title="Facebook">
                                            <a href="#" target="_blank"><i class="fa fa-facebook"></i></a>
                                        </li> 
                                        <li data-toggle="tooltip" title data-original-title="Twitter">
                                            <a href="#" target="_blank"><i class="fa fa-twitter"></i></a>
                                        </li> 
                                        <li data-toggle="tooltip" title data-original-title="Youtube">
                                            <a href="#" target="_blank"><i class="fa fa-youtube"></i></a>
                                        </li>                     
                                    </ul>
                                    <!-- End Social-->
                                  
                               </div>
                               <!-- End Info  Team  -->
                                
                                <!-- Skills Team  -->
                                <div class="col-md-4 padding-top-mini">
                                     <h3>Skills</h3>
                                    <div class="meter color nostripes">
                                        <span style="width: 50%"><span>DESING</span><span class="text-right">50%</span></span>
                                    </div>
                                    <div class="meter color nostripes">
                                        <span style="width: 70%"><span>PHOTOGRAPHY</span><span class="text-right">70%</span></span>
                                    </div>
                                    <div class="meter color nostripes">
                                        <span style="width: 90%"><span>BRANDING</span><span class="text-right">90%</span></span>
                                    </div>
                                    <div class="meter color nostripes">
                                        <span style="width: 100%"><span>SOCIAL MEDIA</span><span class="text-right">100%</span></span>
                                    </div>
                               </div>
                               <!-- End Skills Team  -->

                           </div> 
                       </div> 
                    </li>
                    <!-- End Item Slide Team  -->

                     <!-- Item Slide Team  -->
                    <li>
                        <div class="container">
                            <div class="row">

                                <!-- Image Team  -->
                                <div class="col-md-3">
                                   <a href="img/team-members/2.png" class="fancybox">
                                        <img src="img/team-members/2.png" alt="" title="View Image">
                                    </a>
                                </div>
                                <!-- End Image Team  -->
                                
                                <!-- Info  Team  -->
                                <div class="col-md-5 padding-top-mini">
                                  <h3 class="title-subtitle">
                                        Federic Gordon.
                                        <span>Front End.</span>
                                   </h3>
                                   <p>Inani nominati sit eu. Te ubique cotidieque philosophia mel, vix id omnes iudico prompta. Ex usu nihil mediocritatem. Sea quod vituperata no, omittam offendit vel in. Noster voluptua luptatum id mea.</p>

                                    <a href="mailto:demo@ithemes.com" target="_blank" class="btn btn-primary">SEND ME AN EMAIL</a>

                                    <!-- Social-->
                                    <ul class="social">
                                        <li data-toggle="tooltip" title data-original-title="Facebook">
                                            <a href="#" target="_blank"><i class="fa fa-facebook"></i></a>
                                        </li> 
                                        <li data-toggle="tooltip" title data-original-title="Twitter">
                                            <a href="#" target="_blank"><i class="fa fa-twitter"></i></a>
                                        </li> 
                                        <li data-toggle="tooltip" title data-original-title="Youtube">
                                            <a href="#" target="_blank"><i class="fa fa-youtube"></i></a>
                                        </li>                     
                                    </ul>
                                    <!-- End Social-->
                                  
                               </div>
                               <!-- End Info  Team  -->
                                
                                <!-- Skills Team  -->
                                <div class="col-md-4 padding-top-mini">
                                     <h3>Skills</h3>
                                    <div class="meter color nostripes">
                                        <span style="width: 50%"><span>DESING</span><span class="text-right">50%</span></span>
                                    </div>
                                    <div class="meter color nostripes">
                                        <span style="width: 70%"><span>PHOTOGRAPHY</span><span class="text-right">70%</span></span>
                                    </div>
                                    <div class="meter color nostripes">
                                        <span style="width: 90%"><span>BRANDING</span><span class="text-right">90%</span></span>
                                    </div>
                                    <div class="meter color nostripes">
                                        <span style="width: 100%"><span>SOCIAL MEDIA</span><span class="text-right">100%</span></span>
                                    </div>
                               </div>
                               <!-- End Skills Team  -->

                           </div> 
                       </div> 
                    </li>
                    <!-- End Item Slide Team  -->

                     <!-- Item Slide Team  -->
                    <li>
                        <div class="container">
                            <div class="row">

                                <!-- Image Team  -->
                                <div class="col-md-3">
                                   <a href="img/team-members/3.png" class="fancybox">
                                        <img src="img/team-members/3.png" alt="" title="View Image">
                                    </a>
                                </div>
                                <!-- End Image Team  -->
                                
                                <!-- Info  Team  -->
                                <div class="col-md-5 padding-top-mini">
                                  <h3 class="title-subtitle">
                                        Federic Gordon.
                                        <span>Front End.</span>
                                   </h3>
                                   <p>Inani nominati sit eu. Te ubique cotidieque philosophia mel, vix id omnes iudico prompta. Ex usu nihil mediocritatem. Sea quod vituperata no, omittam offendit vel in. Noster voluptua luptatum id mea.</p>

                                    <a href="mailto:demo@ithemes.com" target="_blank" class="btn btn-primary">SEND ME AN EMAIL</a>

                                    <!-- Social-->
                                    <ul class="social">
                                        <li data-toggle="tooltip" title data-original-title="Facebook">
                                            <a href="#" target="_blank"><i class="fa fa-facebook"></i></a>
                                        </li> 
                                        <li data-toggle="tooltip" title data-original-title="Twitter">
                                            <a href="#" target="_blank"><i class="fa fa-twitter"></i></a>
                                        </li> 
                                        <li data-toggle="tooltip" title data-original-title="Youtube">
                                            <a href="#" target="_blank"><i class="fa fa-youtube"></i></a>
                                        </li>                     
                                    </ul>
                                    <!-- End Social-->
                                  
                               </div>
                               <!-- End Info  Team  -->
                                
                                <!-- Skills Team  -->
                                <div class="col-md-4 padding-top-mini">
                                     <h3>Skills</h3>
                                    <div class="meter color nostripes">
                                        <span style="width: 50%"><span>DESING</span><span class="text-right">50%</span></span>
                                    </div>
                                    <div class="meter color nostripes">
                                        <span style="width: 70%"><span>PHOTOGRAPHY</span><span class="text-right">70%</span></span>
                                    </div>
                                    <div class="meter color nostripes">
                                        <span style="width: 90%"><span>BRANDING</span><span class="text-right">90%</span></span>
                                    </div>
                                    <div class="meter color nostripes">
                                        <span style="width: 100%"><span>SOCIAL MEDIA</span><span class="text-right">100%</span></span>
                                    </div>
                               </div>
                               <!-- End Skills Team  -->

                           </div> 
                       </div> 
                    </li>
                    <!-- End Item Slide Team  -->

                  
            </ul>  
            <!-- End Slide Team  -->  
        
        </section>
        <!-- End Team Slide-->

        <!-- Clients -->
        <section class="paddings shadow-top clients">
            <div class="container">
               <div class="row">   
                    <!-- title-downloads -->             
                    <h1 class="title-downloads">
                        <span class="logo-clients">Roken</span> has been downloaded 
                        <span class="responsive-numbers">
                            <span>2</span>
                            ,
                            <span>3</span>
                            <span>8</span>
                            <span>9</span>
                            ,
                            <span>5</span>
                            <span>1</span>
                            <span>8</span>
                        </span>
                        times.
                    </h1>  
                    <!-- End title-downloads -->     
                    
                    <!-- subtitle-downloads --> 
                    <div class="subtitle-downloads">
                        <div class="line"></div>
                        <h4>Best Service With <i class="fa fa-thumbs-up"></i> By</h4>
                    </div> 
                    <!-- End subtitle-downloads --> 

                    <!-- Image Clients Downloads --> 
                    <ul class="image-clients-downloads">
                        <li><img src="img/clients-downloads/1.jpg" alt=""></li>
                        <li><img src="img/clients-downloads/2.jpg" alt=""></li>
                        <li><img src="img/clients-downloads/3.jpg" alt=""></li>
                        <li><img src="img/clients-downloads/4.jpg" alt=""></li>
                        <li><img src="img/clients-downloads/5.jpg" alt=""></li>
                        <li><img src="img/clients-downloads/6.jpg" alt=""></li>
                        <li><img src="img/clients-downloads/7.jpg" alt=""></li>
                        <li><img src="img/clients-downloads/8.jpg" alt=""></li>
                    </ul>
                    <!-- End Image Clients Downloads --> 
               </div>                
            </div>
        </section>
        <!-- End Clients -->

        <!-- Sponsors -->
        <section class="sponsors">
            <div class="overflow-sponsors">
                <div class="container paddings">

                   <h2>We have  earned the trust of <span> 25,869 </span>customers , including  these fine  companies</h2>
                   
                    <!-- Sponsors -->
                    <ul id="sponsors">

                        <!-- Sponsor -->
                        <li data-toggle="tooltip" title data-original-title="Tooltip Hover">
                            <a href="#"><img src="img/sponsors/logos/1.png" alt=""></a>
                        </li>  
                        <!-- Item Sponsor -->

                        <!-- Sponsor -->
                        <li data-toggle="tooltip" title data-original-title="Tooltip Hover">
                            <a href="#"><img src="img/sponsors/logos/6.png" alt=""></a>
                        </li>  
                        <!-- Item Sponsor -->

                        <!-- Sponsor -->
                        <li data-toggle="tooltip" title data-original-title="Tooltip Hover">
                            <a href="#"><img src="img/sponsors/logos/3.png" alt=""></a>
                        </li>  
                        <!-- Item Sponsor -->

                        <!-- Sponsor -->
                        <li data-toggle="tooltip" title data-original-title="Tooltip Hover">
                            <a href="#"><img src="img/sponsors/logos/4.png" alt=""></a>
                        </li>  
                        <!-- Item Sponsor -->

                        <!-- Sponsor -->
                        <li data-toggle="tooltip" title data-original-title="Tooltip Hover">
                            <a href="#"><img src="img/sponsors/logos/5.png" alt=""></a>
                        </li>  
                        <!-- Item Sponsor -->

                        <!-- Sponsor -->
                        <li data-toggle="tooltip" title data-original-title="Tooltip Hover">
                            <a href="#"><img src="img/sponsors/logos/6.png" alt=""></a>
                        </li>  
                        <!-- Item Sponsor -->

                        <!-- Sponsor -->
                        <li data-toggle="tooltip" title data-original-title="Tooltip Hover">
                            <a href="#"><img src="img/sponsors/logos/4.png" alt=""></a>
                        </li>  
                        <!-- Item Sponsor -->     

                    </ul>
                    <!-- End Sponsors --> 

                    <div class="circle">
                        <i class="fa fa-thumbs-up"></i>
                    </div>

                </div>
            </div>
        </section>
        <!-- End Sponsors -->

       
        <!-- Important Info -->
        <section class="padding-top important-info pattern-important-info">
            <div class="container text-center">
               <img src="img/team-members/members.png" alt="">  
               <div class="title">
                   <h1>Great Team.</h1>
               </div>     
            </div>
        </section>
        <!-- End Important Info -->        

        <!-- footer top-->
        <footer class="footer-top">
            <div class="container">
               <div class="row">   
                   <div class="col-md-3">
                       <h3>018000-236-5899 </h3>
                   </div>
                   <div class="col-md-3">
                       <h3><a href="#">Support</a> - <a href="#">Sales</a></h3>
                   </div>
                   <div class="col-md-3">
                       <h3><a href="mailto:sales@roken.com" target="_blank">sales@roken.com</a></h3>
                   </div>
                   <div class="col-md-3">
                       <h3>24x7x365</h3>
                   </div>
               </div>                
            </div>
        </footer>      
        <!-- End footer Top-->

        <!-- footer Center-->
        <footer class="footer-center">
            <div class="container">

               <div class="row top">   
                   <div class="col-md-3 item-center">
                        <span class="arrow_footer"></span>
                        <i class="fa fa-phone"></i>
                        <h4>Talk to u</h4>                        
                   </div>
                   <div class="col-md-3 item-center">
                        <span class="arrow_footer"></span>
                        <i class="fa fa-comment"></i>
                        <h4>Live Chat</h4>                        
                   </div>
                   <div class="col-md-3 item-center">
                       <span class="arrow_footer"></span>
                        <i class="fa fa-envelope"></i>
                        <h4>Email Us</h4>                        
                   </div>
                   <div class="col-md-3 item-center">
                        <span class="arrow_footer"></span>
                        <i class="fa fa-thumbs-up"></i>
                        <h4>Good Support</h4>                        
                   </div>
               </div>    

                <div class="row">   
                   <div class="col-md-4">
                        <div class="border-right">
                            <i class="fa fa-twitter"></i>
                            <h4>Latest Tweet</h4>                     
                            <div class="twitter">  

                            </div>                        
                        </div>
                   </div>
                   <div class="col-md-3">
                        <div class="border-right">
                            <h4>Newsletter</h4>
                            <p>Enter your e-mail and subscribe to our newsletter.</p>

                            <form id="newsletterForm" action="php/mailchip/newsletter-subscribe.php">
                                <div class="input-group">
                                    <span class="input-group-addon">
                                        <i class="fa fa-envelope"></i>
                                    </span>
                                    <input class="form-control" placeholder="Email Address" name="email"  type="email" required="required">
                                    <span class="input-group-btn">
                                        <button class="btn btn-primary" type="submit" name="subscribe" >Go!</button>
                                    </span>
                                </div>
                            </form>   
                            <div id="result-newsletter"></div>
                       </div>
                    </div>
                    <div class="col-md-2">
                        <div class="border-right">
                            <h4>Recent Links</h4>
                            <ul class="links">
                                <li><i class="fa fa-check"></i> <a href="#">Work</a></li>
                                <li><i class="fa fa-check"></i> <a href="#">About Us</a></li>
                                <li><i class="fa fa-check"></i> <a href="#">Services</a></li>
                                <li><i class="fa fa-check"></i> <a href="#">Contact</a></li>
                            </ul>
                       </div>
                    </div>
                   <div class="col-md-3">
                        <h4>Recent flickr</h4>
                        <ul id="flickr" class="thumbs"></ul>
                   </div>
               </div>    

            </div>
        </footer>      
        <!-- End footer Center-->

        <!-- footer bottom-->
        <footer class="footer-bottom">
            <div class="container">
               <div class="row">   
                                                                  
                    <!-- Nav-->
                    <div class="col-md-8">
                        <div class="logo-footer">
                            <h2><span>R</span>oken<span>.</span></h2>
                        </div>
                        <!-- Menu-->
                        <ul class="menu-footer">
                            <li><a href="index.html">HOME</a> </li>
                            <li><a href="about.html">ABOUT</a></li>
                            <li><a href="services.html">SERVICES</a></li> 
                            <li><a href="portfolio.html">PORTFOLIO</a></li> 
                            <li><a href="blog.html">BLOG</a></li>                                                     
                            <li><a href="contact.html">CONTACT</a></li>
                        </ul>
                        <!-- End Menu-->

                        <!-- coopring-->
                       <div class="row coopring">
                           <div class="col-md-8">
                               <p>&copy; 2013 Roken . All Rights Reserved.  1995 - 2013</p>
                           </div>
                       </div>    
                       <!-- End coopring-->  

                    </div>
                    <!-- End Nav-->

                    <!-- Social-->
                    <div class="col-md-4">
                        <!-- Social-->
                        <ul class="social">
                            <li data-toggle="tooltip" title data-original-title="Facebook">
                                <a href="#" target="_blank"><i class="fa fa-facebook"></i></a>
                            </li> 
                            <li data-toggle="tooltip" title data-original-title="Twitter">
                                <a href="#" target="_blank"><i class="fa fa-twitter"></i></a>
                            </li> 
                            <li data-toggle="tooltip" title data-original-title="Youtube">
                                <a href="#" target="_blank"><i class="fa fa-youtube"></i></a>
                            </li>                     
                        </ul>
                        <!-- End Social-->
                    </div>
                    <!-- End Social-->

               </div> 
                    
            </div>
        </footer>      
        <!-- End footer bottom-->

    </div>
    <!-- End layout-->

   <!-- ======================= JQuery libs =========================== -->
    <!-- Always latest version of jQuery-->
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
     <!-- jQuery local-->    
    <script>window.jQuery || document.write('<script src="js/jquery.js"><\/script>')</script>    
    <!--Nav-->
    <script type="text/javascript" src="js/nav/tinynav.js"></script> 
    <script type="text/javascript" src="js/nav/superfish.js"></script> 
    <script type="text/javascript" src="js/nav/hoverIntent.js"></script>  
    <script src="js/nav/jquery.sticky.js" type="text/javascript"></script>                                           
    <!--Totop-->
    <script type="text/javascript" src="js/totop/jquery.ui.totop.js" ></script>  
    <!--Slide-->
    <script type="text/javascript" src="js/slide/camera.js" ></script>      
    <script type='text/javascript' src='js/slide/jquery.easing.1.3.min.js'></script>  
    <!--FlexSlider-->
    <script src="js/flexslider/jquery.flexslider.js"></script> 
    <!--Ligbox--> 
    <script type="text/javascript" src="js/fancybox/jquery.fancybox.js"></script> 
    <!-- carousel.js-->
    <script src="js/carousel/carousel.js"></script>  
    <!-- Twitter Feed-->
    <script src="js/twitter/jquery.tweet.js"></script> 
    <!-- flickr Feed-->
    <script src="js/flickr/jflickrfeed.min.js"></script>  
    <!--Scroll-->   
    <script src="js/scrollbar/jquery.mCustomScrollbar.concat.min.js"></script>
    <!-- Nicescroll -->
    <script src="js/scrollbar/jquery.nicescroll.js"></script>
    <!-- Maps -->
    <script src="js/maps/gmap3.js"></script>
    <!-- Filter -->
    <script src="js/filters/jquery.isotope.js" type="text/javascript"></script>
    <!--Theme Options-->
    <script type="text/javascript" src="js/theme-options/theme-options.js"></script>
    <script type="text/javascript" src="js/theme-options/jquery.cookies.js"></script>                                
    <!-- Bootstrap.js-->
    <script type="text/javascript" src="js/bootstrap/bootstrap.js"></script>
    <!--MAIN FUNCTIONS-->
    <script type="text/javascript" src="js/main.js"></script>
    <!-- ======================= End JQuery libs =========================== -->
        
    </body>
</html>